var GLOBAL={
    time:null,
    mX:null,
    mY:null,
    x2time:function(){
	return "now";
    }
}
var SAUDI763={};
var KZH1907={};
var CTRL={};

var SVG_WIDTH = 800;		// 画布宽度
var SVG_HEIGHT = 500;		// 画布高度
var CO_leftgutter = 30;	// 坐标到画布左边缘的距离
var CO_bottomgutter = 20;	// 坐标到画布底部边缘的距离
var CO_topgutter = 20; 	// 坐标到画布顶部边缘的距离
var COLOR_OF_CURVE = "hsl(" + [( .6 || Math.random()), .5, .5] + ")";
var COLOR_PATH_FG = "#";
var paper = Raphael("holder", SVG_WIDTH, SVG_HEIGHT);//初始化畫布
var TXT0 = {font: '12px Helvetica, Arial', fill: "#fff"};
var TXT1 = {font: '10px Helvetica, Arial', fill: "#fff"};
var TXT2 = {font: '12px Helvetica, Arial', fill: "#000"};
var X = (SVG_WIDTH - CO_leftgutter) / 16; // 坐标格宽度
var MAX_DATA = 23000;// Math.max.apply(Math, DATA);	  // 数据里Y轴最大值
var Y = (SVG_HEIGHT - CO_bottomgutter - CO_topgutter) / (MAX_DATA); // 坐标格高度
var C_WIDTH = SVG_WIDTH - CO_leftgutter - X;
var C_HEIGHT = SVG_HEIGHT - CO_bottomgutter - CO_topgutter;

var POP_FUNC_ARRAY=[];
var HIDE_FUNC_ARRAY=[];

var path1907 = 1;
var path763 = paper.path().attr({stroke: COLOR_OF_CURVE, "stroke-width": 4, "stroke-linejoin": "round"}); // 右边的曲线


var lx = 0, ly = 0;
var is_label_visible = false;
var leave_timer;			 // 全局的计时器变量，用于动画
var blanket = paper.set();		 // 存放用于接收鼠标动作的矩形们

var BACK=paper.rect(0, 0, SVG_WIDTH, SVG_HEIGHT).attr({stroke: "none", fill: "#000", opacity: 0}); // 背景上用于鼠标动作的矩形
// var BACK=paper.rect(CO_leftgutter, 0, SVG_WIDTH, SVG_HEIGHT - CO_bottomgutter).attr({stroke: "none", fill: "#000", opacity: 0.1}); // 背景上用于鼠标动作的矩形
var label = paper.set();	// 弹出框里的文字部分。
label.push(paper.text(60, 12, "24 hits").attr(TXT0));
label.push(paper.text(60, 27, "22 September 2008").attr(TXT1).attr({fill: COLOR_OF_CURVE}));
label.hide();
var frame = paper.popup(100, 100, label, "right").attr({fill: "#000", stroke: "#666", "stroke-width": 2, "fill-opacity": .7}).hide();//彈出文字對話框的边框和背景

// var show_Y1907=[];		// 显示参数
// var show_X1907=[];
// var show_Y763=[];
// var show_X763=[];
// var svg_Y1907=[];		// svg上实际参数
// var svg_X1907=[];
// var svg_Y763=[];
// var svg_X763=[];
// var abs_Y1907=[];		// 坐标参数
// var abs_X1907=[];
// var abs_Y763=[];
// var abs_X763=[];
var TIMELINE={
    time:null,
    _lx:null,
    _rx:null,
    _status:false,
    // left:paper.path("M0,0L0,"+C_HEIGHT).attr("stroke","#F00"),
    // right:paper.path("M"+C_WIDTH+",0L"+C_WIDTH+","+C_HEIGHT).hide(),
    // mov:function(px){
    // 	this.left.attr({path:["M",px , CO_topgutter,
    // 			      "L",px , C_HEIGHT+CO_topgutter]});
    // 	this.time=GLOBAL.x2time(px);
    // 	return this.time;
    // },
    show:function(){
	this.left.show();
	this.right.show();
	this._status=true;
    },
    hide:function(){
	this.left.hide();
	this.right.hide();
	this._status=false;
    },
    SetClock:function(time){
	var min=Math.floor(time / 60);
	var sec=time % 60;
	$("#time").html(min+":"+sec);
    }
}


// -----------========== FUNCTIONS ========--------------

var Msg=function(id){return typeof id=="string"?document.getElementById(id):id;};

function getAnchors(pp1x, pp1y, p2x, p2y, pp3x, pp3y) {
    var p1x = pp1x < p2x ? pp1x : pp3x;
    var p1y = pp1x < p2x ? pp1y : pp3y;
    var p3x = pp1x < p2x ? pp3x : pp1x;
    var p3y = pp1x < p2x ? pp3y : pp1y;
    var l1 =( (p2x - p1x) / 2);
    var l2 = ((p3x - p2x) / 2);
    // var l1 =Math.abs( (p2x - p1x) / 2);
    // var l2 = Math.abs((p3x - p2x) / 2);
    var a = Math.atan((p2x - p1x) / Math.abs(p2y - p1y));
    var b = Math.atan((p3x - p2x) / Math.abs(p2y - p3y));
    // var a = Math.atan(Math.abs((p2x - p1x) / (p2y - p1y)));
    // var b = Math.atan(Math.abs((p3x - p2x) / (p2y - p3y)));
    a = p1y < p2y ? Math.PI - a : a;
    b = p3y < p2y ? Math.PI - b : b;
    var alpha = Math.PI / 2 - ((a + b) % (Math.PI * 2)) / 2;
    dx1 = l1 * Math.sin(alpha + a),
    dy1 = l1 * Math.cos(alpha + a),
    dx2 = l2 * Math.sin(alpha + b),
    dy2 = l2 * Math.cos(alpha + b);
    return {
        x1: (pp1x < p2x ? (p2x - dx1) : (p2x + dx2)),
        y1: (pp1x < p2x ? (p2y + dy1) : (p2y + dy2)),
        x2: (pp1x < p2x ? (p2x + dx2) : (p2x - dx1)),
        y2: (pp1x < p2x ? (p2y + dy2) : (p2y + dy1)),
    };
}


function drawGrid (x, y, w, h, wv, hv, color) {//畫背景標尺
    var gridColor = color || "#000";
    var path = ["M", Math.round(x) + .5, Math.round(y) + .5, "L", Math.round(x + w) + .5, Math.round(y) + .5, Math.round(x + w) + .5, Math.round(y + h) + .5, Math.round(x) + .5, Math.round(y + h) + .5, Math.round(x) + .5, Math.round(y) + .5];
    var rowHeight = h / hv;
    var columnWidth = w / wv;
    for (var i = 1; i < hv; i++) {
        path = path.concat(["M", Math.round(x) + .5, Math.round(y + i * rowHeight) + .5, "H", Math.round(x + w) + .5]);
    }
    for (i = 1; i < wv; i++) {
        path = path.concat(["M", Math.round(x + i * columnWidth) + .5, Math.round(y) + .5, "V", Math.round(y + h) + .5]);
    }
    return paper.path(path.join(",")).attr({stroke: gridColor});
};
drawGrid(CO_leftgutter , CO_topgutter, C_WIDTH, C_HEIGHT, 16, 23, "#000"); //畫背景標尺

function show2real(px,py){
    return {x:px-leftgutter,y:height-bottomgutter-py};
}

function real2show(px,py){
    return {x:leftgutter+px,y:height-bottomgutter-py};
}


